﻿<!DOCTYPE html>
<html>
<head>
    <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
    <title></title>
    <script type="text/javascript" src="http://api.map.baidu.com/api?v=2.0&ak=zQM4bq6uHh8hnevHLXijZbGkmDG6L0di"></script>
    <script src="/Themes/Js/init.js"></script>

    <style type="text/css">
        * { font-size: 12px; padding: 0; margin: 0; }
        .text { border: 0px; border-bottom: 1px solid #A9A9A9; }
        input { line-height: 150%; font-size: 16px; }
        .search { font-family: "微软雅黑"; font-size: 14px; line-height: 1.5; padding: 10px 0 10px 10px; }
    </style>
</head>
<body>
    <div class="search">
        <div id="r-result">请输入: <input type="text" id="suggestId" size="20" value="百度" style="width:500px;" /></div>
        <div id="searchResultPanel" style="border:1px solid #C0C0C0;width:150px;height:auto; display:none;"></div>

        <input id='Longitude' name='Longitude' type='text' style="width: 100px; color: gray;" class="text" readonly />,
        <input id='Latitude' name='Latitude' type='text' style="width: 100px; color: gray;" class="text" readonly />
        地址：<input id='Address' name='Address' type='text' style="width: 500px;" class="text" />
        <input id="Button1" type="button" value=" 确 定 " onclick="tijiao();" />
    </div>

    <div id="allmap" style="height: 550px; width: 100%;"></div>

    <script type="text/javascript">

        function tijiao() {
            if ($.GetValue("Longitude") != "" && $.GetValue("Latitude") != "") {
                $.DialogCallback({ Longitude: $.GetValue("Longitude"), Latitude: $.GetValue("Latitude"), Address: $.GetValue("Address") });
            }
            else {
                $.messager.alert('提示', '请选择坐标点！', 'info');
            }
        }

        var Longitude = "";
        var Latitude = "";
        var Address = "";
        var map = new BMap.Map("allmap");

        $(function () {
            var height = $(window).height() - 90;
            $("#allmap").css("height", height + "px");

            if ($.getUrlParamer("Longitude") != "") {
                Longitude = $.getUrlParamer("Longitude");
                $.SetValue("Longitude", Longitude);
            }
            if ($.getUrlParamer("Latitude") != "") {
                Latitude = $.getUrlParamer("Latitude");
                $.SetValue("Latitude", Latitude);
            }
            if ($.getUrlParamer("Address") != "") {
                Address = $.getUrlParamer("Address");
                $.SetValue("Address", Address);
            }


            // 百度地图API功能
            // var map = new BMap.Map("allmap");
            map.enableScrollWheelZoom();   //启用滚轮放大缩小，默认禁用
            map.enableContinuousZoom();    //启用地图惯性拖拽，默认禁用
            var geolocationControl = new BMap.GeolocationControl();// 添加定位控件
            map.addControl(geolocationControl);

            // 添加带有定位的导航控件
            var navigationControl = new BMap.NavigationControl({
                // 靠左上角位置
                anchor: BMAP_ANCHOR_TOP_LEFT,
                // LARGE类型
                type: BMAP_NAVIGATION_CONTROL_LARGE,
                // 启用显示定位
                enableGeolocation: true
            });
            map.addControl(navigationControl);

            var size = new BMap.Size(10, 20);
            map.addControl(new BMap.CityListControl({
                anchor: BMAP_ANCHOR_TOP_RIGHT,
                offset: size,
            }));


            if (Longitude != "" && Latitude != "") {
                var point = new BMap.Point(Longitude, Latitude);
                map.centerAndZoom(point, 20);
                var marker = new BMap.Marker(point);// 创建标注
                map.addOverlay(marker);// 将标注添加到地图中
            }
            else {
                map.centerAndZoom("沈阳", 15);
            }

            var geoc = new BMap.Geocoder();
            //单击获取点击的经纬度
            map.addEventListener("click", function (e) {
                Longitude = e.point.lng;
                Latitude = e.point.lat;

                $.SetValue("Longitude", e.point.lng);
                $.SetValue("Latitude", e.point.lat);


                var pt = e.point;
                geoc.getLocation(pt, function (rs) {
                    var addComp = rs.addressComponents;
                    Address = rs.address;
                    if (rs.surroundingPois.length > 0) {
                        Address += " " + rs.surroundingPois[0].title;
                    }
                    $.SetValue("Address", Address);
                });
            });
        });

        var ac = new BMap.Autocomplete(    //建立一个自动完成的对象
            {
                "input": "suggestId"
                , "location": map
            });

        ac.addEventListener("onhighlight", function (e) {  //鼠标放在下拉列表上的事件
            var str = "";
            var _value = e.fromitem.value;
            var value = "";
            if (e.fromitem.index > -1) {
                value = _value.province + _value.city + _value.district + _value.street + _value.business;
            }
            str = "FromItem<br />index = " + e.fromitem.index + "<br />value = " + value;

            value = "";
            if (e.toitem.index > -1) {
                _value = e.toitem.value;
                value = _value.province + _value.city + _value.district + _value.street + _value.business;
            }
            str += "<br />ToItem<br />index = " + e.toitem.index + "<br />value = " + value;
            G("searchResultPanel").innerHTML = str;
        });

        var myValue;
        ac.addEventListener("onconfirm", function (e) {    //鼠标点击下拉列表后的事件
            var _value = e.item.value;
            myValue = _value.province + _value.city + _value.district + _value.street + _value.business;
            G("searchResultPanel").innerHTML = "onconfirm<br />index = " + e.item.index + "<br />myValue = " + myValue;

            setPlace();
        });

        function setPlace() {
            map.clearOverlays();    //清除地图上所有覆盖物
            function myFun() {
                var pp = local.getResults().getPoi(0).point;    //获取第一个智能搜索的结果
                map.centerAndZoom(pp, 18);
                map.addOverlay(new BMap.Marker(pp));    //添加标注
            }
            var local = new BMap.LocalSearch(map, { //智能搜索
                onSearchComplete: myFun
            });
            local.search(myValue);
        }

        function G(id) {
            return document.getElementById(id);
        }

    </script>
</body>
</html>
